/* eslint-disable no-unused-expressions */
/**
 * Created by zhangsong on 2019-05-08.
 */
import React, { Component, Fragment } from 'react';
import { Button, Table, Tooltip, Modal, DatePicker, Switch } from 'antd';
import { formatMessage } from '@/utils/i18n';
import { connect } from 'dva';
import { PageHeaderWrapper } from '@ant-design/pro-layout';
import { Pagination, gender } from '@/constants/styleConfig';
import Authorized from '@/utils/Authorized';
import { ContractorApplication } from '@/constants/routes';
import AlarmReducer from '@/dva/application/alarmemail';
import Power from '@/constants/power';
import moment from 'moment';
import _ from 'lodash';
// import { downloadCsv } from '@/utils/download/downloadCsv';

import Search from './search.js';

const { Namespace, Effects } = AlarmReducer;

@connect(
  state => ({
    alarmemailStore: state[Namespace],
  }),
  dispatch => ({
    getAlarmemailList: data =>
      dispatch({
        type: `${Namespace}/${Effects.getAlarmemailList}`,
        data,
      }),
    downLoadXlsx: data =>
      dispatch({
        type: `${Namespace}/${Effects.downLoadXlsx}`,
        data,
      }),
    modifyState: data =>
      dispatch({
        type: `${Namespace}/${Effects.modifyState}`,
        data,
      }),
  }),
)
class Index extends Component {
  constructor(props) {
    super(props);
    this.state = {
      swcheck: false,
      callMadal: false,
      itemrecord: {},
      alarmState: 0,
    };
  }

  // componentDidMount() {
  //   const { getAlarmemailList } = this.props;
  //   getAlarmemailList({ page: 1, pageSize: 10 });
  //   this.timer = setInterval(
  //     () => {
  //       console.log('打印是生生世世')
  //       getAlarmemailList({ page: 1, pageSize: 10 });
  //     },
  //     600000,
  //   );
  // }

  // componentWillUnmount() {
  //   this.timer && clearTimeout(this.timer);
  // }

  onDownload = listData => {
    // downloadCsv()
    // const array = listData.map(({ surname, nameAlias }) => [surname, nameAlias])
    // downloadCsv(array, ['name', 'age'], 'test.xlsx');
    const { downLoadXlsx } = this.props;
    downLoadXlsx();
    console.log('guolaiaiuiaia', listData);
  };


  onDetailClick = (text, record) => {
    const { history } = this.props;
    const { id } = record;
    history.push(`${ContractorApplication.detail.url}?id=${id}`);
  };

  handleUpdate = (text, record) => {
    const { history } = this.props;
    const { id } = record;
    history.push(`${ContractorApplication.modify.url}?id=${id}`);
  };

  onPreviewClick = (text, record) => {
    const { getPreviewPdfById } = this.props;
    const { id } = record;
    getPreviewPdfById(id);
  };

  onPreviewClickSure = () => {
    const { handPDFModalCancel } = this.props;
    handPDFModalCancel();
  };

  renderColumns = () => [
    {
      title: formatMessage({ id: 'applicationContractor.columns.surname.name' }),
      dataIndex: 'englishName',
    },
    {
      title: formatMessage('applicationContractor.columns.nameAlias.name'),
      dataIndex: 'name',
    },
    {
      title: formatMessage('applicationContractor.columns.identityCard.name'),
      dataIndex: 'identityCard',
    },
    {
      title: formatMessage('applicationCommon.readerCard.passno'),
      dataIndex: 'personNumber',
    },
    {
      title: formatMessage('applicationContractor.columns.contractNumber.name'),
      dataIndex: 'contractNumber',
    },
    {
      title: formatMessage('applicationCommon.workerCard.alarm.checkindate'),
      dataIndex: 'recognizeTime',
    },
    {
      title: formatMessage('applicationContractor.columns.emergencyContactedTelephone.name'),
      dataIndex: 'tel',
    },
    // {
    //   title: formatMessage('baseInfo.approvalStatusName'),
    //   dataIndex: 'status',
    //   render: text => {
    //     if (text === 1) {
    //       return formatMessage('baseInfo.approvalStatus');
    //     }
    //     if (text === -1) {
    //       return formatMessage('baseInfo.disapprovalStatus');
    //     }
    //     if (text === 0) {
    //       return formatMessage('baseInfo.needApprovalStatus');
    //     }
    //     return null;
    //   },
    // },
    // {
    //   title: formatMessage('applicationCommon.readerCard.passno'),
    //   dataIndex: 'card_no',
    // },

    {
      title: formatMessage('button.operator'),
      key: 'operator',
      render: (text, record, index) => {
        const onSwCheck = (bool, even) => {
          console.log('onSwCheck', bool, even, text, record, index);
          this.setState({
            callMadal: true,
            itemrecord: record,
            alarmState: bool ? 0 : 1,
            swcheck: !bool,
          })
        };
        return (
          <div>
            <Authorized authority={Power.ContractorApplication.modify}>
              <Tooltip title={formatMessage('button.update')}>
                <Switch
                  onChange={onSwCheck}
                  checkedChildren="开启"
                  unCheckedChildren="关闭"
                  checked={!record.alert}
                />
              </Tooltip>
            </Authorized>
          </div>
        );
      },
    },
  ];

  onChange = pagination => {
    const { current, pageSize } = pagination;
    console.log('sssssss', pagination)
    const { getAlarmemailList, alarmemailStore } = this.props;
    const {
      endTime,
      startTime,
      passNumber,
    } = alarmemailStore;
    getAlarmemailList({
      page: current,
      pageSize,
      endTime,
      startTime,
      passNumber,
    });
  };

  onOkDate = () => {
    const { modifyState, alarmemailStore = {} } = this.props;
    const {
      pageSize,
      page,
      endTime,
      startTime,
      passNumber,
    } = alarmemailStore;
    const { itemrecord, alarmState } = this.state;
    const params = {
      data: {
        id: itemrecord.id,
        alert: alarmState,
      },
      list: {
        page,
        pageSize,
        endTime,
        startTime,
        passNumber,
      },
    }
    modifyState(params)
    this.setState({
      callMadal: false,
    })
  }

  render() {
    const { alarmemailStore = {} } = this.props;
    const {
      pageSize,
      page,
      listData,
      total,
      listLoading,
      xslloading,
    } = alarmemailStore;
    const { swcheck, callMadal } = this.state;
    const pagination = Pagination({
      page,
      pageSize,
      total,
    });
    return (
      <PageHeaderWrapper>
        <Search
          onDownload={() => this.onDownload(listData)}
          submit={values => this.getAlarmemailList(values)}
          exloading={xslloading}
        />
        {/* <div style={{ display: 'flex', justifyContent: 'end', padding: '0 0 10px' }}>
          <Button htmlType="button" icon="download" onClick={() => this.onDownload(listData)}>
            {formatMessage('button.newdownload')}
          </Button>
        </div> */}
        <Modal
          title={swcheck ? formatMessage('applicationCommon.workerCard.isvaccina') : formatMessage('applicationCommon.workerCard.isvaccinas')}
          visible={callMadal}
          onCancel={() => {
            this.setState({
              callMadal: false,
            });
          }}
          onOk={this.onOkDate}
        >
        </Modal>
        <Table
          loading={!!listLoading}
          rowKey="id"
          columns={this.renderColumns()}
          dataSource={listData}
          onChange={this.onChange}
          pagination={pagination}
        />
      </PageHeaderWrapper>
    );
  }
}

export default Index;
